<script type="text/javascript">
      $(document).ready(function() {
          $(".addCvList").click(function() {
            $('.hideLogo').css("display","none");
            $('.addCvDiv').css("display","block");
            $('.searchCvsDiv').css("display","none");
          });
          $(".searchCvs").click(function(){
            $('.hideLogo').css("display","none");
            $('.addCvDiv').css("display","none");
            $('.searchCvsDiv').css("display","block");
          });
      });
</script>
<div class="addCvResponse" id="addCvResponse"></div>
<form method="POST" enctype="multipart/form-data" action="upload.php">
  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Personal Data</h4>
      <div class="span1"> </div>
      First Name: <input type="text" id="fname" class="input-medium search-query"
                      placeholder="Enter first name here" autocomplete="OFF">
      Middle Name: <input type="text" id="mname" class="input-medium search-query"
                      placeholder="Enter middle name" autocomplete="OFF">
      <br /> <br /><div class="span1"></div>
      Last Name: <input type="text" id="lname" class="input-medium search-query"
                      placeholder="Enter last name here" autocomplete="OFF">
      <br /> <br />
      <div class="span1"> </div>
      Address: <input type="text" id="address" class="input-xlarge search-query"
                      placeholder="Enter address name here" autocomplete="OFF">
      <br /> <br />
      <div class="span1"> </div>
      Country:
       <select onchange="print_state('state',this.selectedIndex);" id="country" 
                    name = "country"></select> 
       City/District/State:
       <select name ="state" id = "state"></select>
       <script language="javascript">print_country("country");</script>

      <br /><br /><div class="span1"></div>
      Nationality: <input type="text" id="nationality" class="input-medium search-query"
                      Placeholder="Enter nationality" autocomplete="OFF">
      <br /> <br /><div class="span1"></div>
      Tel: <input type="text" id="tel" class="input-small search-query"
                      Placeholder="Enter tel num" autocomplete="OFF">
      Mobile: <input type="text" id="mobile" class="input-medium search-query"
                      Placeholder="Enter mobile number" autocomplete="OFF">
      E-mail: <input type="email" id="email" class="input-medium search-query"
                      Placeholder="Enter email address" autocomplete="OFF">
      <br /> <br /><div class="span1"></div>
      Date of birth: <input type="date" id="dob" class="input-small search-query">
      Gender: <select class="input-small search-query" id="gender">
      <option>-Gender-</option><option>Female</option><option>Male</option>
      </select>
      Marital Status:
      <select class="input-small search-query" id="marital">
        <option>-Status-</option>
        <option>Divorced</option>
        <option>Married</option>
        <option>Single</option>
        <option>Widow</option>
      </select>
      Military Status:
      <select class="input-small search-query" id="military">
        <option>-Status-</option>
        <option>Complete</option>
        <option>Exemption</option>
        <option>Postponed</option>
        <option>Serving</option>
      </select>



      <br /> <br/>
      <div class="span1"></div>
      

      <div id="main">
        <h1>Upload Your Images</h1>
        <form method="post" enctype="multipart/form-data"  action="upload.php">
            <input type="file" name="images" id="images" multiple />
            <button type="submit" id="btn">Upload Files!</button>
          </form>

        <div id="response"></div>
        <ul id="image-list">

        </ul>
      </div>
    </div>
  </div>

  
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Education</h4>
      <div class="span1"></div>
      Univeristy Degree: <input type="text" id="uniDegree" class="input-medium search-query"
                      Placeholder="Enter degree here" autocomplete="OFF">
      University: <input type="text" id="uni" class="input-medium search-query"
                      Placeholder="Enter University name" autocomplete="OFF">
      <br /><br /><div class="span1"></div>
      Faculty: <input type="text" id="faculty" class="input-medium search-query"
                      Placeholder="Enter faculty name" autocomplete="OFF">
      <br /> <br />
      <div class="span1"></div>
      Department: <input type="text" id="department" class="input-medium search-query"
                      Placeholder="Enter department name" autocomplete="OFF">
      Grade: 
      <select id="grade">
        <option>-Select Grade-</option>
        <option>Excellent with honor</option>
        <option>Excellent</option>
        <option>Very good</option>
        <option>Good</option>
        <option>Pass</option>
      </select>
      Graduation year:
      <select class="input-small" id="gYear">
        <option>-Select Year-</option>
      </select>
      <br /> <br />
      <div class="span1"></div>
      Graduation project: 
      <br/><div class="span1"></div>
      <textarea rows="5" id="gProject" style="resize:none; width:500px" 
        placeholder="Enter graduation project description here ..." ></textarea>
        <br /> <br/>
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Job</h4>
      <div class="span1"></div>
      Job applying for: <input type="text" id="appJob" class="input-medium search-query"
                      Placeholder="Enter job title" autocomplete="OFF">
      <br /> <br />
      <table border="0">
        <tr>
          <td><div class="span1"></div></td>
          <td>
            Job Objectives:      
          </td>
          <td><div class="span1"></div></td>
          <td>Job Field:</td>
        </tr>
        <tr>
          <td></td>
          <td>
            <textarea rows="5" style="resize:none; width:300px" id="jObjectives" 
        placeholder="Enter job objectives description here ..." ></textarea>
          </td>
          <td><div class="span1"></div></td>
          <td>
            <textarea rows="5" style="resize:none; width:300px" id="jField"
        placeholder="Enter job field description here ..." ></textarea>
          </td>
        </tr>
      </table>
      <br />
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Training</h4>
      <div class="span1"></div>
      Employer: <input type="text" id="tEmployer1" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px">
        From <input type="text" id="tFrom1" class="input-small search-query"
                      Placeholder="From" autocomplete="OFF">
        To <input type="text" id="tTo1" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Project: <input type="text" id="tProject1" class="input-medium search-query"
                      Placeholder="Enter project name" autocomplete="OFF">
      <br /> <br/>
      <hr />
      <div class="span1"></div>
      Employer: <input type="text" id="tEmployer2" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px"> 
        From <input type="text" id="tFrom2" class="input-small search-query"
                      Placeholder="From" autocomplete="OFF">
        To <input type="text" id="tTo2" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Project: <input type="text" id="tProject2" class="input-medium search-query"
                      Placeholder="Enter project name" autocomplete="OFF">
      <br /> <br/>
      <hr/>
      <div class="span1"></div>
      Employer: <input type="text" id="tEmployer3" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px">
        From <input type="text" id="tFrom3" class="input-small search-query"
                      Placeholder="From" autocomplete="OFF">
        To <input type="text" id="tTo3" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Project: <input type="text" id="tProject3" class="input-medium search-query"
                      Placeholder="Enter project name" autocomplete="OFF">
      <br /> <br/>
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Experience</h4>
      <div class="span1"></div>
      Employer: <input type="text" id="eEmployer1" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px">
        From <input type="text" id="eFrom1" class="input-small search-query"
                      Placeholder="From" autocomplete="OFF">
        To <input type="text" id="eTo1" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Job: <input type="text" id="eProject1" class="input-medium search-query"
                      Placeholder="Enter job name" autocomplete="OFF">
      <br /> <br/>
      <hr/>
      <div class="span1"></div>
      Employer: <input type="text" id="eEmployer2" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px">
        From <input type="text" id="eFrom2" class="input-small search-query"
                      Placeholder="From" autocomplete="OFF">
        To <input type="text" id="eTo2" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Job: <input type="text" id="eProject2" class="input-medium search-query"
                      Placeholder="Enter job name" autocomplete="OFF">
      <br /> <br/>
      <hr/>
      <div class="span1"></div>
      Employer: <input type="text" id="eEmployer3" class="input-medium search-query"
                      Placeholder="Enter employer name" autocomplete="OFF">
      <br /><br />
      <span style="padding-left:80px">Duration:<br /></span>
      <span style="padding-left:80px">
        From <input type="text" id="eFrom3" class="input-small search-query"
                        Placeholder="From" autocomplete="OFF">
        To <input type="text" id="eTo3" class="input-small search-query"
                      Placeholder="To" autocomplete="OFF">
      </span>
      <br /> <br />
      <div class="span1"></div>
      Job: <input type="text" id="eProject3" class="input-medium search-query"
                      Placeholder="Enter job name" autocomplete="OFF">
      <br /> <br/>
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Courses</h4>
      <div class="span1"></div>
        <textarea rows="5" cols="50" style="resize:none; width:600px" id="cCourse"
        placeholder="List all courses here ..." ></textarea>
      <br /> <br/>
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>Skills</h4>          
      <h5>Computer skills</h5>
      <div class="span1"></div>
        <textarea rows="5" cols="50" style="resize:none; width:600px" id="sComputer"
        placeholder="List all computer skills here ..." ></textarea>
      <br /> <br/>
      <h5>Language skills</h5>
      <div class="span1"></div>
        <textarea rows="5" cols="50" style="resize:none; width:600px" id="sLanguage"
        placeholder="List all languages here ..." ></textarea>
      <br /> <br/>
      <h5>Personal skills</h5>
      <div class="span1"></div>
        <textarea rows="5" cols="50" style="resize:none; width:600px" id="sPersonal"
        placeholder="List all personal skills here ..." ></textarea>
      <br /> <br/>
    </div>
  </div>
  <br />

  <div class="row addCvDiv">
    <div class="span12 img-polaroid">
      <h4>References</h4>
      <div class="span1"></div>
        <textarea rows="5" cols="50" style="resize:none; width:600px" id="references"
        placeholder="List all references details here ..." ></textarea>
      <br /> <br/>
    </div>
  </div>
  <br />
  <div class="row addCvDiv">
    <div class="span2 offset10">
      <input type="button" value="Insert" class="btn btn-primary" onclick="addCv();">
    </div>
  </div>
  <script src="assets/js/upload.js"></script>

</form>